<template>
  <div
    :class="{
      wAuto: !width,
    }"
    :style="{
      width: typeof width === 'string' ? width : `${width}px`,
    }">
    <el-time-select v-model="keyword" start="00:00" step="00:15" end="23:45" class="wAuto" placeholder="选择时间" format="HH:mm" value-format="HH:mm" />
  </div>
</template>
<script setup lang="ts">
//获取父级数据
const props = withDefaults(
  defineProps<{
    data?: any;
    dataName?: string;
    width?: number | string;
  }>(),
  {},
);
const keyword = computed({
  get() {
    if (props.dataName) {
      return props.data[props.dataName];
    } else {
      return props.data;
    }
  },
  set(val) {
    if (val && props.type === 'number') {
      val = Number(val);
    }
    props.data[props.dataName] = val;
  },
});
const emit = defineEmits<{
  //fn为父组件引入子组件是定义的子组件事件属性，可随意定义
  (event: 'copyBtn'): void;
}>();
</script>
<style scoped></style>
